<%@page import="com.right.entity.Comment"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../favicon.ico">

<title>类型管理</title>

<!-- 引入layui.css文件 -->
<link rel="stylesheet" href="layui/css/layui.css" media="all">

<!--1. Bootstrap core CSS -->
<link href="dist/css/bootstrap.min.css" rel="stylesheet">
<!--2. Custom styles for this template -->
<link href="css/dashboard.css" rel="stylesheet">


</head>
<body>

	<jsp:include page="nav.html"></jsp:include>

	<div class="container-fluid">
		<div class="row">
			<div class="col-sm-3 col-md-2 sidebar">
				<ul class="nav nav-sidebar">
					<li><a href="s-user.jsp">商家信息</a></li>
					<li><a href="s-orders.jsp">订单列表</a></li>
					<li class="active"><a href="s-comment.jsp">评价列表</a></li>
					<li><a href="FoodsServlet?op=selectByPage">菜品列表
					</a></li>
					<li><a href="s-foodsadd.jsp">增加菜品</a></li>
				</ul>

			</div>
			<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
				<h2 class="sub-header">
					评论列表
					<form class="navbar-form navbar-right" action="CommentServlet"
						method="post">
						<input type="text" class="form-control" name="keywords"
							id="keywords" placeholder="关键字" value="${keywords}"> <input
							type="hidden" name="op" value="selectByPage"> <input
							type="submit" class="btn btn-primary" value="查询">

					</form>

				</h2>
				<div class="table-responsive" style="height: 450px;">
					<table class="table table-striped">
						<thead>
							<tr>
								<th>评论编号</th>
								<th>订单编号</th>
								<th>星级</th>
								<th>内容</th>
								<th>评论时间</th>
								<th>操作</th>
							</tr>
						</thead>
						<tbody>
							<!-- 如果属性范围内的pData为null，我们就跳转到CommentServlet去获取数据，然后再转发回来 -->
							<c:if test="${pData==null}">
								<!-- c:redirect 跳转到 CommentServlet -->
								<c:redirect url="CommentServlet?op=selectByPage"></c:redirect>
							</c:if>
							<!-- 如果 范围内的list不为空，遍历数据并展示结果 -->
							<c:if test="${pData!=null}">
								<c:forEach items="${pData.data}" var="comment">
									<tr>
										<td>${comment.commentid}</td>
										<td>${comment.orderid}</td>
										<td>${comment.judge}</td>
										<td>${comment.content}</td>
										<td>${comment.commenttime}</td>
										<td><a class="updatecomment" href="#">修改</a> | <a class="delfoods" href="#">删除</a></td>

									</tr>
								</c:forEach>
							</c:if>
						</tbody>
					</table>

				</div>
				
				<!-- 显示 分页导航区域 -->
				<div id="pagediv" style="text-align: center;"></div>

			</div>
		</div>
	</div>

	<!-- Bootstrap core JavaScript
    ================================================== -->
	<!--3 - js/jquery-2.0.3.js -->
	<script src="js/jquery-2.0.3.js"></script>
	<!--4 - ootstrap.min.js -->
	<script src="dist/js/bootstrap.min.js"></script>

	<!-- 引入layui.js文件 -->
	<script src="layui/layui.js" charset="utf-8"></script>
	<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
	<script>
layui.use(['laypage', 'layer'], function(){
  var laypage = layui.laypage
  ,layer = layui.layer;
 
//完整功能
  laypage.render({
    elem: 'pagediv'	//分页的导航显示在哪个div
    /* ,theme:'#428bca' //颜色 */
    ,count: ${pData.totalCount} //总记录数
    ,curr: ${pData.page} //当前页
    ,limit: ${pData.pageSize} //当前页的记录数
    ,layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
    ,jump: function(obj, first){
	    //obj包含了当前分页的所有参数，比如：
	    console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
	    console.log(obj.limit); //得到每页显示的条数
	    
	    //首次不执行
	    if(!first){
	      //do something
	       location.href="CommentServlet?op=selectByPage&page="+obj.curr+"&pageSize="+obj.limit+"&keywords="+$("#keywords").val();
	    }
	  }
  });  
//根据class的值定位到a标签，设置单击事件
  $(".delfoods").click(function(){
 	 //得到这行的第一个td中的foodsid的值
 	 var commentid = $(this).parents("tr").find("td").eq(0).text();
 	//提示用户是否删除?
 	layer.confirm('是否确定删除编号为'+commentid+"的评论", {
	    btn: ['是的没错','搞错了算了'] //按钮
	  }, function(){
	    // ajax请求删除操作
	    $.ajax({
	    	//参数
	    	url: "CommentServlet",
	    	type: "post",
	    	data:{
	    		commentid: commentid,
	    		op: "del"
	    	},
	    	success: function(res){
	    		//判断返回值的结果，根据结果做提示以及后续的页面刷新操作
	    		if(res.msg == "true")
	    			{
	    			layer.msg('删除好了，可以关了', {
	    				icon: 1,
	    			    time: 2000, //2s后自动关闭
	    			    btn: ['确定']
	    			  },function(){  
	    				  //页面刷新
	    				  
	    				  location.href="CommentServlet?op=selectByPage&page="+${pData.page}+"&pageSize="+${pData.pageSize}+"&keywords="+$("#keywords").val();	    				  
	    			  });	    					    			
	    			}
	    		else{
	    			
	    			layer.msg('删除失败!搞错了，再来', {
	    				icon: 1,
	    			    time: 2000, //2s后自动关闭
	    			    btn: ['确定']
	    			  });
	    		}	
	    	},
	    	dataType: "json"	
	    });
  });
  });
  /**********删除结束********/
  
  
  /***********修改开始******/
  $(".updatecomment").click(function(){
		  
		  //得到类型的typeid
		  var commentid=$(this).parents("tr").find("td").eq(0).text();
		  var orderid=$(this).parents("tr").find("td").eq(1).text();
		  var judge=$(this).parents("tr").find("td").eq(2).text();
		  var content=$(this).parents("tr").find("td").eq(3).text();
		  var commenttime=$(this).parents("tr").find("td").eq(4).text();
		  
		  $("#commentid").val(commentid);
		  $("#orderid").val(orderid);
		  $("#judge").val(judge);
		  $("#content").val(content);
		  $("#commenttime").val(commenttime);
	
		  
		
		//弹出层
		  layer.open({
			  type: 1,
			  area: ['600px', '400px'],
			  content: $('#updatediv') //这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响
			});
		  
		  
	   });  
	  /*********修改结束*******/
 });
  </script>
  <div id="updatediv" style="display: none; width: 500px">
		<br>
		<form class="layui-form" action="CommentServlet?op=update" method="post" >

			<div class="layui-form-item">
				<label class="layui-form-label">评论编号</label>
				<div class="layui-input-block">
					<input type="text" name="commentid" id="commentid" required
						lay-verify="required" readonly class="layui-input">
				</div>
			</div>

			<div class="layui-form-item">
				<label class="layui-form-label">订单编号</label>
				<div class="layui-input-block">
					<input type="text" name="orderid" id="orderid" required
						lay-verify="required" class="layui-input">
				</div>
			</div>

			<div class="layui-form-item layui-form-text">
				<label class="layui-form-label">星级</label>
				<div class="layui-input-block">
				<input type="text" name="judge" id="judge" required
						lay-verify="required" class="layui-input">
				</div>
			</div>

			<div class="layui-form-item layui-form-text">
				<label class="layui-form-label">评论内容</label>
				<div class="layui-input-block">
				<input type="text" name="content" id="content" required
						lay-verify="required" class="layui-input">
				</div>
			</div>
			
			<div class="layui-form-item layui-form-text">
				<label class="layui-form-label">评论时间</label>
				<div class="layui-input-block">
				<input type="text" name="commenttime" id="commenttime" required
						lay-verify="required" class="layui-input">		
				</div>
			</div>			
			
			<div class="layui-form-item">
				<div class="layui-input-block">
					<button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
					<button type="reset" class="layui-btn layui-btn-primary">重置</button>
				</div>
			</div>
		</form>

		<!-- <script>
//Demo
layui.use('form', function(){
  var form = layui.form;
  
  //监听提交
  form.on('submit(formDemo)', function(data){
    
	  //可以1 表单提交  2 可以用ajax
	  //得到了表单 中的数据,传递给servlet完成数据访问即可
	  //未完， 待  "大家" 续
	  
	  layer.msg(JSON.stringify(data.field));
    
    //return false是不做表单提交
    return false;
  });
});
</script> -->

	</div>



</body>
</html>